<!DOCTYPE html>
<html>
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <meta charset="utf-8">
    <meta name="viewport"  content="width=device-width,user-scalable=no">
    <title>{$info.name}</title>
</head>


<script src="__STATIC__/mall/js/1.js"></script>
<script src="http://libs.baidu.com/jquery/1.9.0/jquery.js"></script>
<style type="text/css">
    /* css 重置 */
    body, p, input, h1, h2, h3, h4, h5, h6, ul, li, dl, dt, dd, form { margin: 0; padding: 0; list-style: none; vertical-align: middle; font-weight:normal; }
    img { border:0; margin: 0; padding: 0;   }
    body { color: #000; -webkit-user-select: none; -webkit-text-size-adjust: none; font:normal 16px/200% "微软雅黑", helvetica, arial; text-align:left;   }
    header, section, footer { display: block; margin: 0; padding: 0 }
    a{text-decoration:none;color:#000;}

    body{ background:#f4f4f4;  }

    /* 内容 */
    #content{ padding:10px 0; background:rgb(244,244,244);  }
    .path{ padding:0 0 5px 5px;   }


    /* 本例子css -------------------------------------- */
    .focus{ width:320px; height:140px;  margin:0 auto; position:relative; overflow:hidden;   }
    .focus .hd{ width:100%; height:11px;  position:absolute; z-index:1; bottom:5px; text-align:center;  }
    .focus .hd ul{ display:inline-block; height:5px; padding:3px 5px; background-color:rgba(255,255,255,0.7);
        -webkit-border-radius:5px; -moz-border-radius:5px; border-radius:5px; font-size:0; vertical-align:top;
    }
    .focus .hd ul li{ display:inline-block; width:5px; height:5px; -webkit-border-radius:5px; -moz-border-radius:5px; border-radius:5px; background:#8C8C8C; margin:0 5px;  vertical-align:top; overflow:hidden;   }
    .focus .hd ul .on{ background:#FE6C9C;  }

    .focus .bd{ position:relative; z-index:0; }
    .focus .bd li img{ width:100%;  height:140px; background:url(images/loading.gif) center center no-repeat;  }
    .focus .bd li a{ -webkit-tap-highlight-color:rgba(0, 0, 0, 0); /* 取消链接高亮 */  }
    .span_class{text-align: center;}
    .one_content{background-color: rgb(244,244,244);}
    p { margin-top : 0;   margin-bottom : 0}
    .btn{width: 100%;height: 40px;background-color: rgb(238,106,106);border:none;outline:none;}
</style>

<body>

<div id="content">
    <div id="focus" class="focus">
        <div class="hd">
            <ul></ul>
        </div>
        <div class="bd">
            <ul>
                <volist name="pic" id="vo">
                    <li><a href="#"><img _src="{$vo.path}" src="images/blank.png" /></a></li>
                </volist>
            </ul>
        </div>
    </div>
    <script type="text/javascript">
        TouchSlide({
            slideCell:"#focus",
            titCell:".hd ul", //开启自动分页 autoPage:true ，此时设置 titCell 为导航元素包裹层
            mainCell:".bd ul",
            effect:"left",
            autoPlay:true,//自动播放
            autoPage:true, //自动分页
            switchLoad:"_src" //切换加载，真实图片路径为"_src"
        });
    </script>
    <div class="one_content">
        <span class="span_class">商品描述:</span>
        <p>
            {$info.content}
        </p>
        <hr>
        <form action="" method="post">
            <input type="radio" checked="checked" name="type" value="integral" />
            积分支付（{$info.integral}积分）
            <br />
            <input type="radio" name="type" value="money" />
            现金支付（{$info.money}元）
            <input name="id" type="hidden" value="{$info.id}" id="gid"/>
        </form>
        <button class="btn" id="pay">确认支付</button>
    </div>
</div>
<script>
    $('#pay').click(function(){
        var a = $("input[type='radio']:checked").val();
        $.post("{:U('Mall/pay')}",{'gid':$('#gid').val(),'type':a},function (data) {
            if (data.reg != 1) {
                alert(data.info);
            } else {
                alert(data.info);
                WeixinJSBridge.call('closeWindow');
            }
        });
    })

</script>
</body>
</html>
